import React from 'react'
import ReactDOM from 'react-dom'

// 需求：isLoading 是 true，显示“加载中…”，否则显示“加载完毕！”。

/* const isLoading = false
let ele
if (isLoading) {
  ele = <h1>加载中...</h1>
} else {
  ele = <h1>加载完毕！</h1>
} */

// 优化：进行函数封装

/* function render() {
  const isLoading = false
  let ele
  if (isLoading) {
    ele = <h1>加载中...</h1>
  } else {
    ele = <h1>加载完毕！</h1>
  }
  return ele
} */

// 三元表达式
function render() {
  const isLoading = true
  return <h1>{isLoading ? '加载中...' : '加载完毕！'}</h1>
}

/* const ele = render()
ReactDOM.render(ele, document.querySelector('#root')) */
// 下面这一行和上面等价
ReactDOM.render(render(), document.querySelector('#root'))
